<template>


    <SearchTablePage :search-config="baseTableSearchModel" :table-config="baseTableModel" />

</template>

<script lang="tsx" setup>
defineOptions({
    name: 'DrillInfoEntryPageData',   //全局别名
    title: '表格页',   //标题
});
import { useSysDicList } from '~/src/utils/useSysDicList';
// 接口
import DrillInfoEntryApi from '/@/api/webPath/DrillInfoEntryApi.ts';


import FORM_FIELD_TYPE from '/@/constants/FormFieldType';
import VDialog from '/@/utils/dialogUtil.ts'
import SysAreaApi from '~/src/api/common/SysAreaApi';
import CommonApi from '~/src/api/CommonApi';

const router = useRouter();
const baseTable = ref(null as any);
const baseTableSearch = ref(null as any);
const editRef = ref<any>(null);
// TODO 后端确认系统字典键字段名称
const entryStatusList = useSysDicList("entry_status")
// TODO 后端确认系统字典键字段名称
const examStatusList = useSysDicList("exam_status")
const townList = ref([])
// const data = { _current: 1, _size: 10 };
// function getList() {
//     DrillInfoEntryApi.getPageData(data).then((res) => {
//         console.log(1111111111, res);
//     })
// }
// 表格搜索初始化searchModel
async function getTownList(areaId: any){
    console.log("v",areaId)
    const data = await SysAreaApi.getSysTownList({ areaId })
    if (data) {
        const { data: townDataList } = data
        townList.value = townDataList.map(x => ({ label: x.town, value: x.areaId }))
    }
}
const baseTableSearchModel = ref({
    columnCount: 4,
    expandLimit: 6,
    autoFit: true,
    columnWidth: '320px',
    labelPosition: 'right',
    labelWidth: '100px',
    items: [ //搜索项初始化

        // {
        //             label: "序号",
        //             field: "id",
        //             clearable: true,
        //             type: FORM_FIELD_TYPE.INPUT,

        //            placeholder:"请输入",

        //         },

        {
            label: "培训名称",
            field: "drillName",
            clearable: true,
            type: FORM_FIELD_TYPE.INPUT,

            placeholder: "请输入",

        },

        // {
        //     label: "单位名称",
        //     field: "drillSponsor",
        //     clearable: true,
        //     type: FORM_FIELD_TYPE.INPUT,

        //     placeholder: "请输入",

        // },
        {
            label: "姓名",
            field: "staffName",
            clearable: true,
            type: FORM_FIELD_TYPE.INPUT,

            placeholder: "请输入",

        },
        {
            label: "电话",
            field: "phone",
            clearable: true,
            type: FORM_FIELD_TYPE.INPUT,

            placeholder: "请输入",

        },
        // {
        //     label: "报名状态",
        //     field: "entryStatus",
        //     clearable: true,
        //     type: FORM_FIELD_TYPE.SINGLE_LAYER_SELECT,
        //     options: entryStatusList,

        //     placeholder: "请输入",

        // },
        {
            label: "所属区域",
            field: "areaId",
            clearable: true,
            render() {
                return <CitySelect onUpdate:modelValue={(v)=>getTownList(v)}/>
            },
            placeholder: "请输入",

        },

        {
            label: "乡镇",
            field: "townId",
            clearable: true,
            type: FORM_FIELD_TYPE.SINGLE_LAYER_SELECT,
            options: townList,

            placeholder: "请输入",

        },
        // {
        //     label: "考试情况",
        //     field: "examStatus",
        //     clearable: true,
        //     type: FORM_FIELD_TYPE.SINGLE_LAYER_SELECT,
        //     options: examStatusList,

        //     placeholder: "请输入",

        // },

        // {
        //             label: "报名时间",
        //             field: "entryDate",
        //             clearable: true,
        //             type: FORM_FIELD_TYPE.DATE_RANGE,
        //            placeholder:"请输入",

        //         config: {
        //             props: {   //日期精度配置
        //                  type: "daterange",
        //                 startPlaceholder: "开始日期",
        //                 endPlaceholder: "结束日期",
        //                 format: "YYYY-MM-DD",
        //                   }
        //            },
        //         },

        // {
        //             label: "创建人",
        //             field: "creator",
        //             clearable: true,
        //             type: FORM_FIELD_TYPE.INPUT,

        //            placeholder:"请输入",

        //         },

        // {
        //             label: "修改人",
        //             field: "reviser",
        //             clearable: true,
        //             type: FORM_FIELD_TYPE.INPUT,

        //            placeholder:"请输入",

        //         },

        // {
        //             label: "排序",
        //             field: "sort",
        //             clearable: true,
        //             type: FORM_FIELD_TYPE.INPUT,

        //            placeholder:"请输入",

        //         },

        // {
        //             label: "创建时间",
        //             field: "create_time",
        //             clearable: true,
        //             type: FORM_FIELD_TYPE.DATE_RANGE,
        //            placeholder:"请输入",

        //         config: {
        //             props: {   //日期精度配置
        //                  type: "daterange",
        //                 startPlaceholder: "开始日期",
        //                 endPlaceholder: "结束日期",
        //                 format: "YYYY-MM-DD",
        //                   }
        //            },
        //         },

    ],

    buttons: [    //功能区域
        {
            name: "导出",
            buttonClass: 'primary',
            width: 100,
            click: ({ row, handlers }) => {   //暴露的方法钩子
                DrillInfoEntryApi.pageDataXls(handlers.getRequestParams(), handlers.getXlsTitle())
            }
        },

        //   {
        //         name: "新增",
        //         buttonClass: 'primary',
        //         width: 100,
        //         click: ({row,handlers}) => {        // 点击回调事件方法钩子，  点击触发

        //             VDialog.open({
        //                 title: '新增',

        //                 content:{ //内容初始形式
        //                     type: 'component', //text:"",预留文本
        //                     name:'/webPath/drillInfoEntry/edit',
        //                     query: {  },

        //                 },

        //                 callBack: (data:any) => {
        //                   handlers.refresh()
        //                 },
        //                 onClose: () => {
        //                     console.log("对话框已关闭");
        //                 },
        //             });

        //         },
        //     },
        {
            name: "刷新",
            buttonClass: 'primary',
            width: 100,
            click: ({ handlers }: { handlers: any }) => {   //暴露的方法钩子
                handlers.refresh();
            },
        },
        {
            name: "批量删除",
            buttonClass: 'danger',
            width: 100,
            isShow: (row: any) => {
                return true;
            },
            click: () => {   //暴露的方法钩子
                console.log(baseTable.value.getSelection());
            },
        },
    ]
})
// 表格初始化Model
const baseTableModel = ref({
    border: true,
    pagination: true,
    inline: true,
    selectable: true,
    isFullscreen: false,
    minWidth: '200px',
    data: {    //table  初始化
        current: 1,
        size: 10,
        total: 100,
        data: []
    },
    requestData: { api: DrillInfoEntryApi.getPageData, query: {} },   //数据源 参数有效性： 'steady|transient'
    columns: [
        // {
        //     label: "序号",
        //     field: "id",
        //     width: 100,
        // },
        {
            label: "培训名称",
            field: "drillName",
            width: 120,
        },
        // {
        //     label: "单位名称",
        //     field: "companyName",
        //     width: 120,
        // },
        {
            label: "填写时间",
            field: "entryDate",
            width: 200,
        },
        {
            label: "姓名",
            field: "staffName",
            width: 120,
        },
        {
            label: "照片",
            field: "userImg",
            fieldFormat: "img",
            width: 180,
        },
        {
            label: "电话",
            field: "phone",
            width: 120,
        },
        {
            label: "区域",
            field: "areaName",
            // fieldFormat: "map-value",
            // valueMap: townList, 
            width: 120,
        },
        {
            label: "乡镇",
            field: "townName",
            // fieldFormat: "map-value",
            // valueMap: townList, 
            width: 120,
        },
        {
            label: "考试情况",
            field: "pass",
            fieldFormat: 'tag',
            valueMap: [
                {
                    value: '1',
                    label: "不通过",
                    type: "danger"
                },
                {
                    value: '0',
                    label: "通过",
                    type: "primary"
                }
            ],
            width: 120,
        },
        {
            label: "报名金额",
            field: "price",
            width: 150,
        },
        {
            label: "活动举办地址",
            field: "address",
            width: 180,
        },
        {
            label: "身份证",
            field: "staffIdentity",
            width: 180,
        },
        {
            label: "身份证照片",
            field: "identityImg",
            fieldFormat: "img",
            width: 180,
        },

        // {
        //     label: "创建人",
        //     field: "creator",
        //     width: 180,
        // },
        // {
        //     label: "修改人",
        //     field: "reviser",
        //     width: 180,
        // },
        //    {
        //     label: "排序",
        //     field: "sort",
        //     width:120,
        //       },
        {
            label: "创建时间",
            field: "create_time",
            width: 200,
        },
        {
            label: "更新时间",
            field: "update_time",
            width: 200,
        },
    ],


    actions: [
        // {
        //     name: "详情",

        //     buttonClass: 'primary',
        //     buttonType: 'text',
        //     click: ({row,index,handlers}) => {

        //         //router.push({name: 'CompanyInfoDetail',})
        //         VDialog.open({
        //             title: '详情',
        //             content:{ //内容初始形式
        //                 type: 'component', //text:"",预留文本
        //                 name:'webPath/drillInfoEntry/detail',
        //                 query: { drillInfoEntryId: row.id },

        //             },
        //             callBack: (data:any) => {
        //               handlers.refresh()
        //             },
        //             onClose: () => {
        //                 console.log("对话框已关闭");
        //             },
        //         });
        //     },
        //     isShow: (row: object) => {
        //         return true;
        //     },
        //     fixed: 'right'
        // },
        // {
        //     name: "照片批量下载",

        //     buttonClass: 'primary',
        //     buttonType: 'text',
        //     click: ({ row, index, handlers }) => {
        //         CommonApi.downloadAttachment(row["imageUrl"])
        //     },
        //     isShow: (row: object) => {
        //         return true;
        //     },
        //     fixed: 'right'
        // },
        // {
        //     name: "制证",

        //     buttonClass: 'warning',
        //     buttonType: 'text',
        //     click: ({ row, index, handlers }) => {
        //         // CommonApi.downloadAttachment(row["imageUrl"])
        //     },
        //     isShow: (row: object) => {
        //         return true;
        //     },
        //     fixed: 'right'
        // },
        // {
        //     name: "编辑",
        //     buttonClass: 'primary',   //按钮颜色控制
        //     buttonType: 'text',      // 按钮风格   text  link  button
        //     isShow: (row: object) => {  //根据业务做动态隐藏张氏
        //         return true
        //     },
        //     click: ({row,index,handlers}) => {        // 点击回调事件方法钩子，  点击触发

        //         VDialog.open({
        //             title: '编辑',
        //             content:{ //内容初始形式
        //                 type: 'component', //text:"",预留文本
        //                 name:'webPath/drillInfoEntry/edit',
        //                 query: { drillInfoEntryId: row.id },

        //             },

        //             callBack: (data:any) => {
        //               handlers.refresh()
        //             },
        //             onClose: () => {
        //                 console.log("对话框已关闭");
        //             },
        //         });

        //     },
        //     fixed: 'right'
        // },

        // {
        //     name: "删除",
        //     buttonClass: 'danger',
        //     buttonType: 'text',
        //     fixed: 'right',
        //     click: ({row,index,handlers}) => {

        //             $baseConfirm('您确定要删除当前项吗', null, async () => {

        //             const { message } =  await DrillInfoEntryApi.del({  drillInfoEntryIds: row.id })
        //                 $baseMessage(message, 'success', 'vab-hey-message-success');

        //         handlers.refresh()

        //         })

        //     }
        // },

    ]

})



onActivated(() => {
})



</script>
